/**
 * 自定义formInfo组件
 * by wangjianjun
 * create 2021-10-20
 */
import React from 'react';
import PropTypes from 'prop-types';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Input, Tooltip } from 'antd';
import { FormItemLayout } from '../formPub';

const FormInfoC = (props) => {
  const { styleRow, form, title, info, helper, formItemLayout, showTitle, labalWrap, disabled, style } = props;
  const { getFieldDecorator } = form;
  return (
    <Form.Item
      {...formItemLayout}
      className={labalWrap ? 'labalWrap' : ''}
      label={
        showTitle ? (
          helper ? (
            <span>
              {title}:&nbsp;
              <Tooltip title={helper}>
                <QuestionCircleOutlined />
              </Tooltip>
            </span>
          ) : (
            <span>{title}:</span>
          )
        ) : null
      }
    >
      <span style={styleRow ? { display: 'inline-block', ...styleRow } : null}>{info ? info : ''}</span>
    </Form.Item>
  );
};

// props类型
FormInfoC.propsTypes = {
  style: PropTypes.object, // 自定义样式
  labalWrap: PropTypes.bool, // 支持标题换行
  form: PropTypes.object, // form对象
  title: PropTypes.string, // 显示名称
  info: PropTypes.string, // 文本内容
  helper: PropTypes.oneOfType([
    // 提示帮助信息
    PropTypes.string,
    PropTypes.element,
  ]),
  formItemLayout: PropTypes.object, // 布局
  disabled: PropTypes.bool, // 禁用
  showTitle: PropTypes.bool, // 是否展示输入框名称
};

// props默认值
FormInfoC.defaultProps = {
  title: '',
  info: '',
  helper: '',
  onChange: () => {},
  formItemLayout: FormItemLayout,
  disabled: false,
  showTitle: true,
  labalWrap: false, //默认title不换行
};

export default FormInfoC;
